import { notFound } from "next/navigation";
import { fetchSanityServiceBySlug, SERVICES_SLUGS_QUERY } from "@/sanity/lib/fetch";
import {
  getDynamicFetchOptions,
  sanityFetchMetadata,
  sanityFetchStaticParams,
  type DynamicFetchOptions,
} from "@/sanity/lib/live";
import { SERVICE_QUERY } from "@/sanity/queries/service";
import { draftMode } from "next/headers";
import { Suspense } from "react";
import { ServiceDetailView, type ServiceDetailData } from "@/components/templates";

function PageFallback() {
  return (
    <section aria-busy className="py-20 bg-brand-ivory">
      <div className="container max-w-7xl mx-auto px-4">
        <div className="max-w-3xl mx-auto space-y-4">
          <div className="h-6 w-32 animate-pulse rounded bg-brand-sand" />
          <div className="h-12 w-3/4 animate-pulse rounded bg-brand-sand" />
          <div className="h-20 w-full animate-pulse rounded bg-brand-sand" />
        </div>
      </div>
    </section>
  );
}

const fallbackServices: Record<string, ServiceDetailData> = {
  "private-consultant": {
    title: "Private Couple Consultation",
    slug: "private-consultant",
    targetAudience: "couples",
    tagline: "1-on-1 unbiased planning navigation, budget stress-testing & vendor contract protection",
    shortDescription:
      "Designed for international couples planning a destination wedding in Vietnam who need honest insider scrutiny on quotes, vendor selections, and contract terms without conflict of interest.",
    pricing: "From $111 USD / Hour",
    features: [
      "Unbiased venue & region shortlisting (Da Nang, Phu Quoc, Nha Trang, Saigon)",
      "Full budget modeling with hidden fee & import tariff audit",
      "Vendor contract scrutiny and milestone timeline validation",
      "Direct WhatsApp support during critical decision phases",
    ],
  },
  "private-consultant-services": {
    title: "Private Couple Consultation",
    slug: "private-consultant-services",
    targetAudience: "couples",
    tagline: "1-on-1 unbiased planning navigation, budget stress-testing & vendor contract protection",
    shortDescription:
      "Designed for international couples planning a destination wedding in Vietnam who need honest insider scrutiny on quotes, vendor selections, and contract terms without conflict of interest.",
    pricing: "From $111 USD / Hour",
    features: [
      "Unbiased venue & region shortlisting (Da Nang, Phu Quoc, Nha Trang, Saigon)",
      "Full budget modeling with hidden fee & import tariff audit",
      "Vendor contract scrutiny and milestone timeline validation",
      "Direct WhatsApp support during critical decision phases",
    ],
  },
  "for-couples": {
    title: "Private Couple Consultation",
    slug: "for-couples",
    targetAudience: "couples",
    tagline: "1-on-1 unbiased planning navigation, budget stress-testing & vendor contract protection",
    shortDescription:
      "Designed for international couples planning a destination wedding in Vietnam who need honest insider scrutiny on quotes, vendor selections, and contract terms without conflict of interest.",
    pricing: "From $111 USD / Hour",
    features: [
      "Unbiased venue & region shortlisting (Da Nang, Phu Quoc, Nha Trang, Saigon)",
      "Full budget modeling with hidden fee & import tariff audit",
      "Vendor contract scrutiny and milestone timeline validation",
      "Direct WhatsApp support during critical decision phases",
    ],
  },
  "b2b": {
    title: "B2B Venue & Partner Advisory",
    slug: "b2b",
    targetAudience: "professionals",
    tagline: "Elevating Vietnamese luxury hospitality to global wedding standards",
    shortDescription:
      "Consultancy for resorts, hotels, and premium vendors seeking to attract high-net-worth international destination couples and optimize their event yield.",
    pricing: "Tailored Engagement on Request",
    features: [
      "International wedding package & collateral experience audit",
      "Cross-cultural bridal expectations & culinary protocol training",
      "B2B partner matchmaking and editorial showcase opportunities",
      "Market positioning & high-ticket revenue model design",
    ],
  },
  "b2b-advisory": {
    title: "B2B Venue & Partner Advisory",
    slug: "b2b-advisory",
    targetAudience: "professionals",
    tagline: "Elevating Vietnamese luxury hospitality to global wedding standards",
    shortDescription:
      "Consultancy for resorts, hotels, and premium vendors seeking to attract high-net-worth international destination couples and optimize their event yield.",
    pricing: "Tailored Engagement on Request",
    features: [
      "International wedding package & collateral experience audit",
      "Cross-cultural bridal expectations & culinary protocol training",
      "B2B partner matchmaking and editorial showcase opportunities",
      "Market positioning & high-ticket revenue model design",
    ],
  },
  "for-professionals": {
    title: "B2B Venue & Partner Advisory",
    slug: "for-professionals",
    targetAudience: "professionals",
    tagline: "Elevating Vietnamese luxury hospitality to global wedding standards",
    shortDescription:
      "Consultancy for resorts, hotels, and premium vendors seeking to attract high-net-worth international destination couples and optimize their event yield.",
    pricing: "Tailored Engagement on Request",
    features: [
      "International wedding package & collateral experience audit",
      "Cross-cultural bridal expectations & culinary protocol training",
      "B2B partner matchmaking and editorial showcase opportunities",
      "Market positioning & high-ticket revenue model design",
    ],
  },
};

export async function generateStaticParams() {
  try {
    const { data: services } = (await sanityFetchStaticParams({
      query: SERVICES_SLUGS_QUERY,
    })) as { data: any[] };

    const slugs = (services ?? [])
      .map((service) => ({
        slug: service.slug?.current,
      }))
      .filter((item): item is { slug: string } => Boolean(item.slug));

    if (slugs.length > 0) {
      return slugs;
    }
  } catch (err) {
    // ignore
  }

  return [
    { slug: "private-consultant" },
    { slug: "private-consultant-services" },
    { slug: "for-couples" },
    { slug: "b2b" },
    { slug: "b2b-advisory" },
    { slug: "for-professionals" },
  ];
}

export async function generateMetadata(props: {
  params: Promise<{ slug: string }>;
}) {
  const { slug } = await props.params;

  try {
    const { perspective } = await getDynamicFetchOptions();
    const { data: service } = (await sanityFetchMetadata({
      query: SERVICE_QUERY,
      params: { slug },
      perspective,
    })) as { data: any };

    if (service) {
      return {
        title: `${service.title} | Vietnam Wedding Guide Advisory`,
        description: service.shortDescription || service.tagline,
      };
    }
  } catch (err) {
    // ignore
  }

  const fallback = fallbackServices[slug];
  if (fallback) {
    return {
      title: `${fallback.title} | Vietnam Wedding Guide Advisory`,
      description: fallback.shortDescription || fallback.tagline,
    };
  }

  return {
    title: "Advisory Services | Vietnam Wedding Guide",
    description: "Bespoke destination wedding advisory services for couples and hospitality brands.",
  };
}

export default async function ServicePage(props: {
  params: Promise<{ slug: string }>;
}) {
  const { isEnabled: isDraftMode } = await draftMode();

  if (isDraftMode) {
    return (
      <Suspense fallback={<PageFallback />}>
        <DynamicServicePage params={props.params} />
      </Suspense>
    );
  }

  const { slug } = await props.params;
  return <CachedServicePage slug={slug} perspective="published" stega={false} />;
}

async function DynamicServicePage({
  params,
}: {
  params: Promise<{ slug: string }>;
}) {
  const [{ slug }, { perspective, stega }] = await Promise.all([
    params,
    getDynamicFetchOptions(),
  ]);

  return <CachedServicePage slug={slug} perspective={perspective} stega={stega} />;
}

async function CachedServicePage({
  slug,
  perspective,
  stega,
}: { slug: string } & DynamicFetchOptions) {
  let service: ServiceDetailData | null = await fetchSanityServiceBySlug({ slug, perspective, stega });

  if (!service) {
    service = fallbackServices[slug] || null;
  }

  if (!service) {
    notFound();
  }

  return <ServiceDetailView service={service} />;
}